import { PureComponent } from 'react'
import { Divider, DatePicker, Button } from 'antd'
import SingleTable from 'components/table/index'

import styles from './refundApplication.less'
export default class RefundApplication extends PureComponent {
    render(){
        const dataList = []
        const columns = [
        {
            key: 'gmtCreate',
            title: '转运单号',
            dataIndex: 'gmtCreate',
            align: 'center',
        },
        {
            key: 'operationTypeName',
            title: '国内转运单号',
            dataIndex: 'operationTypeName',
            align: 'center',
        },
        {
            key: 'creatorName',
            title: '创建时间',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '1',
            title: '订单状态',
            dataIndex: 'gmtCreate',
            align: 'center',
        },
        {
            key: '2',
            title: '物流状态',
            dataIndex: 'operationTypeName',
            align: 'center',
        },
        {
            key: '3',
            title: '始发港',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '4',
            title: '目的港',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '5',
            title: '支付方式',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '6',
            title: '支付状态',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '7',
            title: '退款状态',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '9',
            title: '申请金额',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '10',
            title: '货币单位',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '11',
            title: '优惠金额',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '12',
            title: '其他费用',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '13',
            title: '基本运费',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '14',
            title: '总运费',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '15',
            title: '已收款',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '16',
            title: '未收款',
            dataIndex: 'creatorName',
            align: 'center',
        },
        {
            key: '8',
            title: '操作',
            dataIndex: 'creatorName',
            align: 'center',
            render: (text, record) => (
                <span>
                  <a >编辑</a>
                  <Divider type="vertical" />
                  <a >删除</a>
                </span>
            ),
        },
        
        ]
        return(
            <div className={styles.refundApplication}>
                <div className={styles.refundApplicationBox}>
                    <h2>退款申请</h2>
                </div>
                <div className={styles.refundApplicationSearch}>
                    <div className={styles.refundApplicationSin}>
                        <span className={styles.refundApplicationSpan}>开始日期：</span>
                        <DatePicker className={styles.refundApplicationInput}/>
                    </div>
                    <div className={styles.refundApplicationSin} style={{marginLeft: '28px'}}>
                        <span className={styles.refundApplicationSpan}>结束日期：</span>
                        <DatePicker className={styles.refundApplicationInput}/>
                    </div>
                </div>
                <Button type="primary" icon="search" style={{margin: '0 0 24px 24px'}}>查询</Button>
                <div className={styles.refundApplicationTable}>
                    <SingleTable
                        data={{ list: dataList }}
                        columns={columns}
                    />
                </div>
            </div>
        )
    }
}